<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>   
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<%@taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title></title>
	<link rel="stylesheet" href="<%=path %>/automation/css/font.css" />
	<link rel="stylesheet" href="<%=path %>/automation/css/tookList.css" />
	<link rel="stylesheet" href="<%=path %>/automation/plugins/iziModal/iziModal.css" />
			<link rel="stylesheet" href="<%=path %>/css/mushroom.css" />
	
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/gh/bootcdn/BootCDN/ajax/libs/bootstrap/3.3.7/js/bootstrap.min.js"></script>
	<script type="text/javascript" src="<%=path %>/automation/plugins/iziModal/iziModal.js" ></script>
	<script type="text/javascript" src="<%=path %>/automation/js/balloonSpot.js" ></script>
		<script src="<%=path %>/js/loading.js"></script>
	
</head>
<body>
	<div class="took-panel-list" id="list">
		<ul>
			<!-- <li class="took-sheets">
				<div class="took-block">
					<div class="took-block-head normal-block-head">
						<label class="hyper-link"><span>沉睡用户</span></label>
						<label class="tagger icon-toggle-off font-ex text-gray"></label>
						<label class="icon-paste font-ex text-grayer" title="复制"></label>
					</div>
					<div class="took-block-content" data-id="1" style="display:none;">
						<div class="took-canvas"></div>
					</div>
				</div>
			</li>
			<li class="took-sheets">
				<div class="took-block">
					<div class="took-block-head normal-block-head">
						<label class="hyper-link"><span>医药提醒</span></label>
						<label class="tagger icon-toggle-off font-ex text-gray"></label>
						<label class="icon-paste font-ex text-grayer" title="复制"></label>
					</div>
					<div class="took-block-content" data-id="2" style="display:none;">
						<div class="took-canvas"></div>
					</div>
				</div>
			</li> -->
		</ul>
	</div>
	<div id="module-block" style="font-size:13px;"></div>
	<div id="info-block"></div>
	<div id="alert-block"></div>
</body>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>
<script>
	var cid=1;
	var path = "<%=path%>";
	var flag=true;
	$(function(){		
		initList();
		$("#info-block").iziModal({
	        title: "消息",
	        width: 600,
	        zindex: 101
	    });
	 	$("#alert-block").iziModal({
	        title: "提示",
	        width: 300,
	        zindex: 101
	    });
	 	$("#module-block").iziModal({
	        title: "创建新模板",
	        width: 600,
	        zindex: 101
	    });
		$(".tagger").off("click");
		$(".tagger").on("click", function(){
			var $cur = $(this);
			var $parent = $cur.parent();
			if($cur.hasClass("icon-toggle-off")) {
				$cur.removeClass("icon-toggle-off").removeClass("text-gray").addClass("text-green").addClass("icon-toggle-on");
				$parent.removeClass("normal-block-head").addClass("active-block-head");
			} else if($cur.hasClass("icon-toggle-on")) {
				$cur.removeClass("icon-toggle-on").removeClass("text-green").addClass("text-gray").addClass("icon-toggle-off");
				$parent.removeClass("active-block-head").addClass("normal-block-head");
			}
		});
		$(".hyper-title").off("click");
		$(".hyper-title").on("click", function(){
			var $cur = $(this);
			var $parent = $cur.parent();
			var $content = $parent.next("div");
			var id=$parent.parent().data("id");
			if($content.css("display") == "none") {
				templateName=$cur.find("span").html();
				selectPointByTemplateId(id);
				
				var h = 0;
				$content.find("div.semi-block").each(function(){
					var coord = $(this).data("coord");
					var cArr = coord.replace("(", "").replace(")", "").split(",");
					var H = cArr[1] / 1;
					if(H > h) {
						h = H;
					}
				});
				$content.css("height", h + 200);
				$content.slideDown();
			} else {
				$content.find(".took-canvas").empty();
				$content.hide();
			}
		});	
		//预览节点
		$(".took-panel-list").off("click", ".semi-balloon>label");
		$(".took-panel-list").on("click", ".semi-balloon>label", function(){
			var $cur = $(this);
			var $block = $cur.parent().parent();
			var pointId=$block.data("index");
			var id=$block.parent().parent().data("id");
			var type = $block.data("type");
			loadInfoByPoint(id,pointId,type);
			var texts = type == "1" ? "条件" : type == "2" ? "时间" : '动作';
			var modal = $("#info-block").iziModal();
			modal.iziModal('setHeaderColor', 'rgb(211, 211, 211)');
			modal.iziModal('setTitle', texts + "预览");
			modal.iziModal('open');
		});		
		$(".icon-paste").off("click");
		$(".icon-paste").on("click", function(){
			var $cur = $(this);
			var id=$cur.parent().parent().data("id");
			var name=$cur.parent().parent().find(".hyper-title>span").html();
			var module = $("#module-block").iziModal();
			var selections = "<label style='margin:0 12px 0 24px;'>请输入模板名称</label><input class='input-extend' />";
			var content = "<div style='padding: 2em 1em;'>" + selections + "</div>";
			var buttons = "<p style='padding:0 1em; text-align:center;'>"
									+ "<label class='item-ace bord-green cancel-confirm' style='margin-right:8px;'><span>取消</span></label>"
									+ "<label class='item-ace btn-green do-confirm' data-id='"+id+"'><span>确定</span></label>"
									+ "</p>";
			$("#module-block").find(".iziModal-content").html(content + buttons);
			module.iziModal('setHeaderColor', 'rgb(211, 211, 211)');
			module.iziModal('open');
			//copy(id,name);
		});
		// the cancel "button" in the creation panel
		$("#module-block").off("click", ".cancel-confirm");
		$("#module-block").on("click", ".cancel-confirm", function(){
			$("#module-block").iziModal('close');
		});
		$("#module-block").off("click", ".do-confirm");
		$("#module-block").on("click", ".do-confirm", function(){
			var id=$(this).data("id");
			var name = $("#module-block").find("input").val();
			if(StringEmpty(name)){
				checkAutomationTemplateByName(name);
				if(flag){
					$("#module-block").iziModal('close');
					copy(id,name);	
				}				
			}else{
				showError("未填写模板名称！");
			}
		});
		$("#alert-block").on("click", ".cancel-confirm", function(){
			$("#alert-block").iziModal('close');
		});
	});
	function showError(info) {
		var modal = $("#alert-block").iziModal();
		modal.iziModal('setHeaderColor', 'rgb(202,38,0)');
		modal.iziModal('setTitle', info);
		modal.iziModal('open');
	}
	function loadItems(id,list) {

				drawSemiSpots({
					blockId: id,
					dataList: list
				});
			}
	function initList(){
		var info;
		var findAllUrl=path+"/automarket/findAllPublicTemplate";
		$.ajax({
 			type:"post",
 			url:findAllUrl,
  			async: false,
  			data:{"cid" : cid
            	},success:function(data){
				if(data.status==200){
					setListHtml(data.data);
				}else{
					showError(data.message);
				}}
		});	
	}
	function setListHtml(info){
		var content="";
		for(var i=0;i<info.length;i++){			
			content+='<li class="took-sheets">';
			content+='<div class="took-block" data-id="'+info[i].id+'">';
				content+='<div class="took-block-head normal-block-head">';		
				content+='<label class="hyper-title"><span>'+info[i].name+'</span></label>';	
			<shiro:hasPermission name="auto_market_page_system_pre:copy">	
			content+='<label class="icon-paste font-ex text-grayer" title="复制"></label>';
			</shiro:hasPermission>
			content+='</div>';
			content+='<div class="took-block-content" data-id="'+info[i].id+'" style="display:none;">';
			content+='<div class="took-canvas"></div>';
			content+='</div>';
			content+='</div>';
		content+='</li>';
		}
		$("#list>ul").html(content);
	}
	//预览节点信息
	function loadInfoByPoint(id,index,type){
		var info;
		var findInfoUrl=path+"/autoMarketPoint/findPublicPointInfoByPointIdAndTemplateId";
		$.ajax({
 			type:"post",
 			url:findInfoUrl,
  			async: false,
  			data:{"cid" : cid,
            	"pointId":index,
            	"templateId":id
            	},success:function(data){
				if(data.status==200){
					info=data.data;
					setHtml(info,type);
				}else{
					showError(data.message);
				}}
		});		
	}
	//预览内容
	function setHtml(info,type){
		var content = "<div style='padding: 1em;'>";
		if(type=="1"){
			var result=JSON.parse(info.pointInfo);
			if(StringEmpty(result.memberGroup)){
				var array=result.memberGroup;
				content+="<div class='block-inner-line'><div><label><b>分组选人</b></label></div><div>";
				for(var i=0;i<array.length;i++){			
					var count=0;
					if(StringEmpty(array[i].count)){
						count=array[i].count;
					}
					content+="<label>"+array[i].name+"（"+count+"）人</label>";
				}
				content+="</div></div>";
			}
			if(StringEmpty(result.customer)||StringEmpty(result.rfm)){
				var customer=result.customer;
				content+="<div class='block-inner-line'><div><label><b>条件选人</b></label></div><div>";
				if(StringEmpty(customer)){
					if(StringEmpty(customer.gender)){
						var gender=customer.gender;
						var text= gender == "m" ? "男" : gender == "f" ? "女" : "未知";
					content+="<label><span>性别</span><span>"+text+"</span></label>";
					}
					if(StringEmpty(customer.startAge)||StringEmpty(customer.endAge)){					
					content+="<label><span>年龄</span><span>"+customer.startAge+"至"+customer.endAge+"岁</span></label>";
					}

					if(StringEmpty(customer.cityInfo)){
						var city=customer.cityInfo;
						var type=customer.cityType;
						var text= type == "remove" ? "排除" : type== "include" ? "包括" : "所有";
						if(text=="所有"){
							content+="<label><span>地区</span><span>全部</span></label>";
						}else{
							content+="<label><span>地区</span><span>"+text+""+city+"</span></label>";
						}
					}
					if(StringEmpty(customer.startEdu)||StringEmpty(customer.endEdu)){
						if(!StringEmpty(customer.startEdu)&&StringEmpty(customer.endEdu)){
							content+="<label><span>教育水平</span><span>"+customer.startEdu+"以上</span></label>";
						}
						if(StringEmpty(customer.startEdu)&&!StringEmpty(customer.endEdu)){
							content+="<label><span>教育水平</span><span>"+customer.startEdu+"以下</span></label>";
						}
						if(StringEmpty(customer.startEdu)&&StringEmpty(customer.endEdu)){
							content+="<label><span>教育水平</span><span>"+customer.startEdu+"至"+customer.endEdu+"</span></label>";
						}
					}
					if(StringEmpty(customer.startLevel)||StringEmpty(customer.endLevel)){
						if(!StringEmpty(customer.startLevel)&&StringEmpty(customer.endLevel)){
							content+="<label><span>会员等级</span><span>"+customer.startLevel+"级以上</span></label>";
						}
						if(StringEmpty(customer.startLevel)&&!StringEmpty(customer.endLevel)){
							content+="<label><span>会员等级</span><span>"+customer.endLevel+"级以下</span></label>";
						}
						if(StringEmpty(customer.startLevel)&&StringEmpty(customer.endLevel)){
						content+="<label><span>会员等级</span><span>"+customer.startLevel+"至"+customer.endLevel+"级</span></label>";
						}
					}
				}				
				var rfm=result.rfm;
				if(StringEmpty(rfm)&&StringEmpty(rfm.pre)){
					var pre=rfm.pre;
					 var action=pre.action;
					 var status=pre.status;
					 if(StringEmpty(pre)){
						 content+= "<label><span>会员状态</span>";
						 if(StringEmpty(pre.dateInfo)&&StringEmpty(pre.dateType)){
								var dateType=pre.dateType=="BEFORE"?"之前":"以内";
								content+="<span>"+pre.dateInfo+"天"+dateType+"</span>";
							}
							var preAction= action == "CREATE_CUSTOMER" ? "新建会员" : action == "BUY_GOODS" ? "购买商品" :action=="BUY_PRICE"? "购物消费":action=="NO_PRICE"?"未消费":"会员储值";
							content+= "<span>"+preAction+"</span>";
							if(StringEmpty(status)){
								var preStatus= status == "BUY_NUMBER" ? "购买次数" :status == "BUY_PRICE" ? "购买金额" :status == "MAX_PRICE" ? "最高消费":status == "AVG_PRICE"?"平均消费":"会员储值";
								content+="<span>"+preStatus+"</span>";
							}
							if(StringEmpty(pre.start)){
								if(status=="BUY_NUMBER"){
									content+="<span>"+pre.start+"</span>";
								}else{
									content+="<span>"+(pre.start)/100+"</span>";
								}
							}
							if(StringEmpty(pre.start)&&StringEmpty(pre.end)){
								if(status=="BUY_NUMBER"){
									content+="<span>至"+pre.end+"</span>";
								}else{
									content+="<span>至"+(pre.end)/100+"</span>";
								}
							}else if(StringEmpty(pre.end)){
								if(status=="BUY_NUMBER"){
									content+="<span>"+pre.end+"以下</span>";
								}else{
									content+="<span>"+(pre.end)/100+"以下</span>";
								}
							}
							content+="</label>";
					 }
					if(StringEmpty(rfm.relation)){
						var relation= rfm.relation=="and" ? "并且" :rfm.relation=="or"?"或者":"不是";
						content+="<label><b style='margin-left: 5.2em;'></b><span>"+relation+"</span>";
					}
					if(StringEmpty(rfm.pos)){
						var pos=rfm.pos;
						 action=pos.action;
						 status=pos.status;
						 if(StringEmpty(action)){
							 	if(StringEmpty(pos.dateInfo)&&StringEmpty(pos.dateType)){
									var dateType=pos.dateType=="BEFORE"?"之前":"以内";
									content+="<span>"+pos.dateInfo+"天"+dateType+"</span>";
								}
								var posAction= action == "CREATE_CUSTOMER" ? "新建会员" : action == "BUY_GOODS" ? "购买商品" :action=="BUY_PRICE"? "购物消费":action=="NO_PRICE"?"未消费":"会员储值";
								content+= "<span>"+posAction+"</span>";
								if(StringEmpty(status)){
									var posStatus= status == "BUY_NUMBER" ? "购买次数" :status == "BUY_PRICE" ? "购买金额" :status == "MAX_PRICE" ? "最高消费":status == "AVG_PRICE"?"平均消费":"会员储值";
									content+="<span>"+posStatus+"</span>";
								}
								if(StringEmpty(pos.start)){
									if(status=="BUY_NUMBER"){
										content+="<span>"+pos.start+"</span>";
									}else{
										content+="<span>"+(pos.start)/100+"</span>";
									}
								}
								if(StringEmpty(pos.start)&&StringEmpty(pos.end)){
									if(status=="BUY_NUMBER"){
										content+="<span>至"+pos.end+"</span>";
									}else{
										content+="<span>至"+(pos.end)/100+"</span>";
									}
								}else if(StringEmpty(pos.end)){
									if(status=="BUY_NUMBER"){
										content+="<span>"+pos.end+"以下</span>";
									}else{
										content+="<span>"+(pos.end)/100+"以下</span>";
									}
								}
								content+="</label></div>";
						 }					
					}	
			}
				content+="</div></div>";
		}
			if(StringEmpty(result.action)){
				var action=result.action;
				var text = action.action == "NO_CANCEL" ? "未核销" : action.action== "CANCEL" ? "核销" : "提表";
				//var text = action == "NO_CANCEL" ? "未核销" : (action== "CANCEL" ? "核销" : "提表");
				content+="<div class='block-inner-line'><div><label><b>行为选人</b></label></div><div><label><span>用户行为</span><span>"+text+"</span></label></div></div>";;
			}
			if(StringEmpty(result.tigger)){
				var tigger=result.tigger;
				var text= tigger.type == "CREATE_CUSTOMER" ? "新建会员" : tigger.type== "BUY_GOODS" ? "购买商品" :tigger.type=="BUY_PRICE"? "购买金额":tigger.type=="BIRTHDAY"?"会员生日":tigger.type=="COUPON_CANCEL"?"卡券核销":"会员储值";
				content+="<div class='block-inner-line'><div><label><b>触发条件选人</b></label></div><div><label><span>用户行为</span><span>"+text+"</span>";
				if(StringEmpty(result.tigger.info)){
					if(tigger.type=="BUY_PRICE"||tigger.type=="BALANCE"){
						content+="<span>"+(tigger.info)/100+"</span>";
					}else{
						content+="<span>"+tigger.info+"</span>";
					}
				}
				content+="</label></div></div>";
			}
			//医药行业
			if(StringEmpty(result.medicineRule)){
				content+=showMedicineInfo(result,"1");
			}
		}else if(type==2){
			var result=JSON.parse(info.pointInfo);
			var type=result.type;
			var text= type == "NOW" ? "现在" :type== "BIRTHDAY" ? "生日" :type=="CUSTOM"?"自定义时间":type=="AFTER"?"倒计时":"使用时间";
			if(type=="NOW"){
				content += "<div class='block-inner-line'><div><label><b>设置时间</b></label></div><div><label>"+text+"";
			}else{
				content += "<div class='block-inner-line'><div><label><b>设置时间</b></label></div><div><label><span>"+text+"</span>";
			}
			if(StringEmpty(type=="CUSTOM")){
				content+="<span>"+result.info+"点</span>";
			}
			if(StringEmpty(type=="AFTER")){
				content+="<span>倒计时"+result.info+"天之后</span>";
			}
			if(StringEmpty(type=="USE_DATE")){
				content+=showMedicineInfo(result,"2");
			}
			content+="</label></div></div>";
		}else if(type=="3"){
			info=JSON.parse(info.pointInfo);
			var arrive_count=0;
			var click_count=0;
			var submit_count=0;		
			var send_count=0;
			var write_off_num=0;
			var write_off_count=0;
			var name=templateName;
			if(StringEmpty(info)&&(StringEmpty(info.send_count))){
				arrive_count=info.arrive_count;
				click_count=info.click_count;
				submit_count=info.submit_count;			
				send_count=info.send_count;
			}
			//var text=type=="SMS"?"短信":"优惠券";
			content += "<div class='block-inner-line'><div><label>名称</label></div><div><label>"+name+"</label></div></div>"
			+ "<div class='block-inner-line'><div><label>发送量</label></div><div><label>"+send_count+"</label></div></div>";
			content+= "<div class='block-inner-line'><div><label>到达量</label></div><div><label>"+arrive_count+"</label></div></div>";
			if(StringEmpty(info)&&info.type!=3){
				content+="<div class='block-inner-line'><div><label>点击量</label></div><div><label>"+click_count+"</label></div></div>"
				+ "<div class='block-inner-line'><div><label>提交表单</label></div><div><label>"+submit_count+"</label></div></div>";
			}			
			if(StringEmpty(info)&&StringEmpty(info.write_off_count)){
				write_off_num=info.write_off_num;
				write_off_count=info.write_off_count;					
			}				
			if(StringEmpty(info.type)&&info.type==2){
				content+="<div class='block-inner-line'><div><label>核销量</label></div><div><label>"+write_off_num+"</label></div></div>";
				content+="<div class='block-inner-line'><div><label>核销总额</label></div><div><label>"+write_off_count+"</label></div></div>";
			}				
		}
		content+="</div>";
		$("#info-block").find(".iziModal-content").html(content);
	}
	//判断字符串是否为空
    function StringEmpty(content) {
        if (content == undefined || content == "" || content == null) {
            return false;
        } else {
            return true;
        }
    }
  //查询模板下所有节点信息
	function selectPointByTemplateId(id){
		var url=path+"/autoMarketPoint/findPublicPointListByPointIdAndTemplateId";
		$.ajax({
 			type:"post",
 			url:url,
  			async: false,
  			data:{"cid" : cid,
            	"templateId":id
            	},success:function(data){
				if(data.status==200){
					loadItems(id,data.data);
				}else{
					showError(data.message);
				}}
		});
	}
	
	function copy(id,name){
		var copyUrl=path+"/automarket/copyPublicAutoMarketTemplate";
		$.ajax({
 			type:"post",
 			url:copyUrl,
  			async: false,
  			data:{"cid" : cid,
            	"id":id,
            	"name":name
            	},success:function(data){
				if(data.status==200){
					window.location.href=path+"/view/automarket/customList";
					parent.$("div.inn-head>ul").find("li:eq(2)>label").click();
				}else{
					showError(data.message);
				}
				}
		});
	}
	//校验名称是否重复
	function checkAutomationTemplateByName(name){
		var copyUrl=path+"/automarket/findTemplateCountByName";
		$.ajax({
 			type:"post",
 			url:copyUrl,
  			async: false,
  			data:{"cid" : cid,
            	"name":name
            	},success:function(data){
				if(data.status!=200){
					flag=true;
				}else{
					showError("模板已存在！");
					flag=false;
				}
			}
		});
	}
</script>
</html>
